{% extends "base.html" %}
{% load humanize %}
{% load bootstrap_pagination %}

{% block content %}
    <div class="row">
        <div class="col-md-8">
            <ol class="breadcrumb">
                <li><a href="{% url 'translations:tags' %}">标签大全</a></li>
                <li class="active">{{ tag.name }}</li>
            </ol>

            <div class="well well-sm">{{ tag.description }}</div>

            {% for article in articles %}
                {% if forloop.counter0 %}<hr>{% endif %}
                <h4><a href="{% url 'translations:detail' article.id %}">{{ article.title }}</a></h4>
                <small><a href="{{ article.recommend_user.profile.get_absolute_url }}">{{ article.recommend_user.profile }}</a> 推荐于 {{ article.recommend_date|naturaltime }}</small>
                <p>{{ article.section_set.first.best_translation.content|striptags|truncatewords:6 }}</p>
            {% endfor %}

            {% if articles.paginator.num_pages > 1 %}
                <hr>
                {% bootstrap_paginate articles range=10 %}
            {% endif %}
        </div>

        <div class="col-md-4">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">
                        热门标签
                        <small class="pull-right"><a href="{% url 'translations:tags' %}">更多 »</a></small>
                    </h3>
                </div>
                <div class="panel-body">
                    {% for tag in hot_tags %}
                    <a href="{% url 'translations:tag' tag.id %}" class="label label-info">{{ tag.name }} ({{ tag.num_articles }})</a>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
{% endblock %}